import 'package:flutter/material.dart';

/**
 * 卡片布局
 * 
 * Flutter还有一种比较比较酷炫的布局方式，我称 它为卡片式布局。这种布局类似ViewList，但是列表会以物理卡片的形态进行展示。
 * 
 * 
 * new Divider(),  类似html里面hr标签
 * 
 * 
 *  */ 

void main()=>runApp(myApp());

class myApp extends StatelessWidget{
  @override

  var card = new Column(
    children: <Widget>[
      new ListTile(
        title: new Text('吉林省吉林市昌邑区',style: TextStyle(fontWeight: FontWeight.w500),), //文字加粗fontWeight
        subtitle: new Text('技术大佬：13490989890'),
        leading: new Icon(Icons.account_box, color:Colors.blue),
      ),
      new Divider(),
      new ListTile(
        title: new Text('广东省广州市天河区', style: TextStyle(fontWeight: FontWeight.w500),),
        subtitle: new Text('大飞：13498987654'),
        leading: new Icon(Icons.access_time, color:Colors.blue),
      ),
      new Divider(),
      new ListTile(
        title: new Text('广东省广州市天河区', style: TextStyle(fontWeight: FontWeight.w500),),
        subtitle: new Text('大飞：13498987654'),
        leading: new Icon(Icons.access_time, color:Colors.blue),
      ),
      new Divider()
    ],
  );

  Widget build(BuildContext context){
    return MaterialApp(
      home:Scaffold(
        appBar: new AppBar(
          title: new Text('卡片布局'),
        ),
        body:Center(child: card,)
      )
    );
  }
}